import { useEffect, useMemo, useState } from 'react';
import { Empty, ConfigProvider } from 'antd';
import {commonLang} from '@inbiz/utils'
import { GlobalRegistry } from '@inbiz/core';
import { observer } from '@formily/react';
export default observer(() => {
  const style = {
    height: 570,
    display: 'flex',
    justifyContent: 'center',
    alignItems: 'center',
    color: 'rgba(0, 0, 0, 0.65)',
  };

  const [locale, $locale] = useState(commonLang[GlobalRegistry.getDesignerLanguage()?.toLocaleLowerCase() as keyof typeof commonLang])
  useEffect(() => {
    $locale(commonLang[GlobalRegistry.getDesignerLanguage()?.toLocaleLowerCase() as keyof typeof commonLang])
  }, [GlobalRegistry.getDesignerLanguage()]);

  return (
    <div style={{ ...style }}>
      <div>
        <ConfigProvider locale={locale}>
          <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
        </ConfigProvider>
      </div>
    </div>
  );
});
